@extends('home.layout')

@section('topbanner')
@endsection

@section('content')
    <div class="m-tab">
        <div class="m-title">
            <a href="{{ get_home_url($detail->document_type.'/list/'.$pCategoryDetail->id.'/'.$categoryDetail->id) }}">
                <h3>{{ $pCategoryDetail->title }}</h3></a>
            <div class="btn">
                @foreach($childCategoryList as $key=>$value)
                    <a href="{{ get_home_url($detail->document_type.'/list/'.$pCategoryDetail->id.'/'.$value->id) }}" class="@if($value->id == $categoryDetail->id) z-cur @endif">{{ $value->title }}</a>
                @endforeach
            </div>
        </div>

        <div class="m-context">
            <!-- p class="title f-tac" >祈福泉</p  -->
            <h3 class="head">{{ $detail->title }}</h3>
            <div class="content">
                <div id="sl">
                    <div class="f-tac">
                        <ul class="focus">
                            @foreach($photoList as $key=>$value)
                                <li><img alt="{{ get_upload_url($value->desc) }}" src="{{ get_upload_url($value->url) }}" width="1002" /></li>
                            @endforeach
                        </ul>
                    </div>

                    <div class="slide" id="slide">
                        <a href="javascript:void(0)" class="u-btn-prev"></a>
                        <a href="javascript:void(0)" class="u-btn-next"></a>
                        <ul class="m-showpic">
                            @foreach($photoList as $key=>$value)
                                <li><img alt="{{ $key + 1 }}" src="{{ get_upload_url($value->url) }}" height="104" /></li>
                            @endforeach
                        </ul>
                    </div>
                </div>

                <div class="mt30">
                    {!! $detail->{$documentType}->content !!}
                </div>
            </div>
        </div>


        <!-- div class="m-context" style="display:none">2</div>
        <div class="m-context" style="display:none">3</div>
        <div class="m-context" style="display:none">4</div -->
    </div>
@endsection

@section('style')
@endsection

@section('script')
    <script src="{{ get_home_asset('js/tab.js') }}"></script>
    <script>
        $(function(){
            //$('.m-topbanner,.m-pic-change').height($(window).height()-130);
            /*$(window).resize(function(){
             $('.m-topbanner,.m-pic-change').height($(window).height()-130);
             })
             jQuery('#slide2').slide({titOnClassName:'z-cur',vis:1,mainCell:'.m-showpic2',autoPlay:true,effect:"left",autoPage:true,titCell:".hd ul",interTime:3500,delayTime:2600});
             */


            //大图和文字切换
            jQuery("#sl").slide({ titCell:".m-showpic li", mainCell:".focus",effect:"left", autoPlay:true,delayTime:100,startFun:function(i,p){
                //if (i>=p) i = 0;
                //控制小图自动翻页
                //alert(p);
                if(i==0){ jQuery("#sl .u-btn-prev").click();jQuery("#sl .u-btn-prev").click() }
                else if( i%4==0 ){ jQuery("#sl .u-btn-next").click()}
            }
            });
            //小图滚动
            jQuery("#sl").slide({ mainCell:".m-showpic",prevCell:".u-btn-prev",nextCell:".u-btn-next",effect:"left",vis:4,scroll:4,delayTime:100,autoPage:true,pnLoop:false, opp:true});


            $('.m-tab').nTab({titleId:'.m-title',contextId:'.m-context'})
            /*
             $("#nav").stick_in_parent({
             parent: "body",
             spacer: ".m-nav"
             });*/
        })
    </script>
@endsection